<template>
  <div class="pg-finance-user-withdraw"
    layout="column">

    <!-- 页面搜索组件
    -------------------------- -->
    <comp-page-search
      :isSingleSearch="true"
      @searchCondChange="searchCondChange"
      module="PgShaohuoContentType"></comp-page-search>


    <!-- 功能按钮区
    -------------------------- -->
    <div class="gl-page-btns">
      <!-- <el-button @click.native="applySelected('id', '2')"
        type="success" size="mini"
        slot="reference"
        :loading="loadingBtn === '已打款' && loadingRow === null">已打款</el-button>
      <el-button @click.native="applySelected('id', '3')"
        type="primary" size="mini"
        slot="reference"
        :loading="loadingBtn === '驳回' && loadingRow === null">驳回</el-button> -->
    </div>

    <!-- 数据表格
    -------------------------- -->
    <comp-page-table
      :tableConfig="tableConfig"
      :tableData="tableData"
      :loading="tableLoading"
      :total="tableTotal"
      :pageSize="Number(pageSize)"
      :pageSizes="pageSizes"
      @currentChange="tableCurrentChange"
      @sortChange="tableSortChange"
      @sizeChange="tableSizeChange"
      @selectionChange="tableSelectionChange">
      <el-table-column
        label="操作"
        width="125">
        <template slot-scope="scope">
          <el-button v-if="scope.row._status === '0'"
            @click.native="applyOne(scope.row.id, scope.$index, '2')"
            type="text" size="small"
            :loading="loadingBtn === '已打款' && loadingRow === scope.$index">已打款</el-button>
          <el-button v-if="scope.row._status === '0'"
            @click.native="applyOne(scope.row.id, scope.$index, '3')"
            type="text" size="small"
            :loading="loadingBtn === '驳回' && loadingRow === scope.$index">驳回</el-button>
          <span v-if="scope.row._status !== '0'"
            class="pg-finance-user-withdraw__handle-text">已处理</span>
        </template>
      </el-table-column>
    </comp-page-table>

  </div>
</template>

<script>
import { tableConfig } from './config'
import {
  listApplyMixin
} from './mixins'

import { FinanceWithdrawService } from 'services/Api'
import {
  ConfirmTempMixin,
  btnLoadingMixin,
  tableCoreMixin,
  tableSingleSearchMixin
} from 'services/Public'
import { mapState } from 'vuex'

export default {
  name: 'PgFinanceUserWithdraw',
  mixins: [
    listApplyMixin,
    ConfirmTempMixin,
    btnLoadingMixin,
    tableCoreMixin,
    tableSingleSearchMixin
  ],
  data () {
    return {
      tableConfig
    }
  },
  computed: {
    ...mapState([ 'acc_id' ]),
    // 获取提现列表参数
    userWithdrawListParam () {
      return {
        acc_id: this.acc_id,
        page: this.page,
        page_size: this.pageSize,
        sort_field: this.sort_field,
        sort_type: this.sort_type,
        search: this.search
      }
    }
  },
  methods: {
    // 提现列表
    preFetchTableData () {
      return FinanceWithdrawService.userWithdrawList(this.userWithdrawListParam)
    },
    tableDataHandler (list) {
      list = list.map(item => {
        item.zfb_way = '支付宝' // 支付方式先写死支付宝
        return item
      })
      return list
    }
  }
}
</script>

<style lang="scss">
@import "src/styles/config/views.scss";

@include b(finance-user-withdraw) {
  @include e(handle-text) {
    color: $--color-danger;
  }
}
</style>
